<template>
  <div>
    <el-button :icon="FolderAdd" type="success" @click="handleImport"
      >批量导入
    </el-button>
    <w-import-excel
      ref="importRef"
      :columns="templateColumns"
      preview
      @save="postUserTemplate"
      @get-template="useExport({}, '后端模板下载地址')"
    />
  </div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { useExport } from '../../../packages/hooks/useExport'
import { FolderAdd } from '@element-plus/icons-vue'

const importRef = ref<any>(null)

const templateColumns = [
  {
    label: '姓名',
    prop: 'name',
  },
  {
    label: '身份证',
    prop: 'idCard',
  },
  {
    label: '年级名',
    prop: 'gradeName',
  },
  {
    label: '班级',
    prop: 'className',
  },
]

const handleImport = () => {
  importRef.value.show()
}

const postUserTemplate = async (data: any) => {
  const { file } = data
  const formData = new FormData()
  formData.append('file', file)
  console.log(formData)
  // const { msg }: any = await doImport(formData)
}
</script>